{% extends 'base.html' %}

{% block head %}


<script type="text/javascript" src="/static/simplechat_waiting.js"></script>

      <style type='text/css'>

		.more {
			display: none;
}

      </style>

    <script type='text/javascript'>

	function showHide(shID) {
		if (document.getElementById(shID)) {
			if (document.getElementById(shID+'-show').style.display != 'none') {
				document.getElementById(shID+'-show').style.display = 'none';
				document.getElementById(shID).style.display = 'block';
			}
			else {
				document.getElementById(shID+'-show').style.display = 'inline';
				document.getElementById(shID).style.display = 'none';
			}
		}
	}

    </script>

	{% endblock %}

	{% block content %}
	
	<div id="top">
      <p>!! CRYPT CHAT !!!</p>
    </div>
	<div id="center">
		
    <div id='display-area'>
		<div id="channel_api_params" style="display:none;" chat_token="{{chat_token}}" channel_id="{{channel_id}}"></div>


        Waiting for another user to join.<br>
<br>

      <div id='this-game' float='top'>
        Send this link to the person you want to chat with <BR>
	    <span id='this-game-link'>{{ chat_link }}</span>
      </div>
<br><br>

	<a href="#" id="example-show" class="showLink" onclick="showHide('example');return false;">See more.</a>
	
	<div id="example" class="more"> 
		The other user has joined.  
		
		<form name="join" action="/chatview">
				<input name="c" value="{{ chat_key }}" type="hidden">
<input name="u" value="x" type="hidden">
<BR>
		<br><input type="submit" id="joinbutton" name="joinbutton" value="Join"><br>

		<br><br>

		</form>
	</div>
    </div>



	{% endblock %}
